$(function(){
     //  初始化图表一：
  // 1-初始化echarts实例， 指定图表的父容器
  var myChart = echarts.init(document.getElementById('c1'));

  // 2-指定图片的所需的数据 和 相关设置 
  var option = {
    // 标题
    title: {
      text: '2020年注册人数'
    },
    // 提示工具
    tooltip: {},
    // 图例
    legend: {
      data: ['销量', '注册人数']
    },
    // x轴
    xAxis: {
      data: ["1月", "2月", "3月", "4月", "5月", "6月"]
    },
    // y轴： 刻度会根据数据自动生成 
    yAxis: {},
    // 系列： 
    series: [
      {
        name: '销量', // 数据名称 
        type: 'bar',  // 图表类型 bar  柱图  line 线图 pie  饼图 
        data: [15, 120, 36, 10, 10, 20]
      },
      {
        name: '注册人数', // 数据名称 
        type: 'line',  // 图表类型 bar  柱图  line 线图 pie  饼图 
        data: [40, 50, 26, 40, 110, 20]
      }
    ]
  };

  // 3-将数据传递给echart的实例进行绘制 
  myChart.setOption(option);


  //  初始化图表三：
   // 1-初始化echarts实例， 指定图表的父容器
   var myChart2 = echarts.init(document.getElementById('c2'));

   // 2-指定图片的所需的数据 和 相关设置 
   var option2 = {
     tooltip: {
       trigger: 'item',
       formatter: '{a} <br/>{b}: {c} ({d}%)'
     },
     legend: {
       orient: 'vertical',
       left: 20,
       data: ['耐克', '阿迪达斯', '匡威', '老北京布鞋', '回力']
     },
     series: [
       {
         name: '访问来源',
         type: 'pie',
         radius: ['50%', '70%'],
         avoidLabelOverlap: false,
         label: {
           normal: {
             show: false,
             position: 'center'
           },
           emphasis: {
             show: true,
             textStyle: {
               fontSize: '30',
               fontWeight: 'bold'
             }
           }
         },
         labelLine: {
           normal: {
             show: false
           }
         },
         data: [
           { value: 335, name: '耐克' },
           { value: 310, name: '阿迪达斯' },
           { value: 234, name: '匡威' },
           { value: 135, name: '老北京布鞋' },
           { value: 1548, name: '回力' }
         ]
       }
     ]
   };
 
   // 3-将数据传递给echart的实例进行绘制 
   myChart2.setOption(option2);
})